<template>
    <div>
        <h1>卡卷更新</h1>
        <table class="table">
            <tr>
                <td>卡卷名称</td>
                <td><input type="text" v-model="data.cname"></td>
            </tr>
            <tr>
                <td>卡卷类型</td>
                <td>
                    <select v-model="data.cardTypeId">
                        <option value="0">请选择</option>
                        <option v-for="x in xl" :value="x.cardTypeId">{{x.cardTypeName}}</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>适用范围</td>
                <td>
                    <select v-model="data.storesId">
                        <option value="0">请选择</option>
                        <option v-for="m in xls" :value="m.storesId">{{ m.storeName }}</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>适用日期</td>
                <td>
                    <span v-for="d in fx">
                        <input v-model="fxk" type="checkbox" :value="d">{{d}}
                    </span>
                </td>
            </tr>
            <tr>
                <td>有效期</td>
                <td><input type="text" v-model="data.cexpirationdate"></td>
            </tr>
            <tr>
                <td>价格</td>
                <td><input type="text" v-model="data.cprice"></td>
            </tr>
            <tr>
                <td>排序</td>
                <td><input type="text" v-model="data.csort"></td>
            </tr>
            <tr>
                <td>状态</td>
                <td>
                    <select v-model="data.stateId">
                        <option value="0">请选择</option>
                        <option v-for="s in xlss" :value="s.stateId">{{s.stateName}}</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>图片</td>
                <td>
                    <input type="file" @change="tp">
                    <img :src="'https://localhost:7242/'+data.cimage" alt="" style="width: 60px;height: 60px;">
                </td>
            </tr>
            <tr>
                <td>是否启用</td>
                <td><input type="checkbox" v-model="data.cEnable">打勾为启用,不打勾为禁用</td>
            </tr>
            <tr>
                <td></td>
                <td><input type="button" value="更新" @click="add"></td>
            </tr>
        </table>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios'
import { ListFormat } from 'typescript';
import {ref,onMounted} from 'vue'
import {useRouter,useRoute} from 'vue-router'
const router=useRouter();
const route=useRoute();
const data=ref({
    "cid": 0,
  "cname": "string",
  "cardTypeId": 0,
  "storesId": 0,
  "cDateTime": "string",
  "cexpirationdate": "string",
  "cprice": 0,
  "csort": 0,
  "stateId": 0,
  "cimage": "string",
  "isDeleted": true,
  "cEnable": true
})
const ft=()=>{
    var f=route.query.cid;
    axios.get("/api/Cradolls/GetCardrollsById",{params:{cid:f}}).then(res=>{
        data.value=res.data;
        fxk.value=data.value.cDateTime.split(',')
    })
}



const fx=ref(["周一","周二","周三","周四","周五","周六","周日"])
const fxk=ref([])
const add=()=>{
    data.value.cDateTime=fxk.value.toString();
    axios.put("/api/Cradolls/UpdateCardrolls",data.value).then(res=>{
        if(res.data>0){
            alert("更新成功")
            router.push({path:"/"})
        }else
        {
            alert("更新失败")            
        }
    })
}
onMounted(()=>{
   ft();
   xlk()
   xlks()
   xlkss() 
})
const xl=ref({})
const xlk=()=>{
    axios.get("/api/CardType/GetCardTypeList").then(res=>{
        xl.value=res.data;
    })
}
const xls=ref({})
const xlks=()=>{
    axios.get("/api/Stores/GetStores").then(res=>{
        xls.value=res.data;
    })
}
const xlss=ref({})
const xlkss=()=>{
    axios.get("/api/State/GetAllState").then(res=>{
        xlss.value=res.data;
    })
}
const tp=(e:any)=>{
    var f=e.target.files[0]
    var fd=new FormData();
    fd.append("file",f);
    
    if(f.size>1*1024*1024){
        alert("文件不能大于1MB")
        return
    }
    if(f.type!="image/jpeg"&&f.type!="image/png"){
        alert("文件不是jpg,png,gif")
        return
    }
    
    axios.post("/api/Image/GetImage",fd).then(res=>{
        data.value.cimage=res.data
    })
}
</script>

<style scoped>

</style>